<template>
	<div class="containers">
		<div class="container1" @click="myclick" ref="myclick1">
			<img src="../../assets/top_icon.png" class="container1_top_icon" />
			<p class="container1_top_text">Chance Battles</p>
			<!-- <div class="container1_bg"></div> -->
			<van-swipe :autoplay="3500" class="container1_swipe_wrapper" ref="swipe" v-touch:right="backbefore">
				<van-swipe-item v-for="(slide, index) in slides" :key="index" class="van_swipe_item">
					<img :src=uploads_url+slide.img alt="container1_swipe_wrapper_img"
						class="container1_swipe_wrapper_img">
				</van-swipe-item>
			</van-swipe>
		</div>
		<!-- <van-pull-refresh v-model="refreshing" @refresh="onRefresh" ref="mypullrefresh"> -->
			<div class="container2" v-if="lottery.length > 0">
				<!-- 第二个占屏幕的30%的部分 -->
				<van-cell v-if="false" class="container2_rule" title="Rule" is-link @click="showPopup" />
				<van-popup v-model:show="show" :style="{ padding: '64px' }">
					<p class="text10" style="font-weight: bold;">Guidance:</p>
					<p class="text11">1.Buy one piece to get a lucky number.</p>
					<p class="text11">2.The winning number will be drawn once the pieces are selling out.</p>
					<p class="text11">3.If the winning number is the same as yours, Congratulations,you've won!</p>
					<p class="text11">4.Fill your post information and wait for delivery.</p>
					<p class="text12" style="font-weight: bold;">About the rule</p>
					<p class="text13">1.Every merchandise will be divided into N pieces.</p>
					<p class="text13">2.Each piece corresponds to a unique lucky number.</p>
					<p class="text13">3.You can buy more pieces.</p>
					<p class="text13">4.About the Winning calculation formula.</p>

				</van-popup>
				<img :src="require('../../assets/winner_background.png')" alt="container2_bg" class="container2_bg">
				<!-- <img :src="require('../../assets/win.png')" alt="container2_win" class="container2_win"> -->
				<!--180控制每个item的宽度:loop="false"-->

				<!-- <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
				<van-row gutter="20">
					<van-col v-for="(item, index) in list" :key="index" span="8">
						 
						<div class="list-item">{{ item }}</div>
					</van-col>
				</van-row>
			</van-list> -->

				<!-- 		<van-swipe :show-indicators="false" :width="190" :touchable="true" :stop-propagation="true"
				@change="onChange" @click="onClick" :autoplay="3500"class="container2_van_swipe" ref="swipe"> -->
				<van-swipe :loop="false" :autoplay="3500" :show-indicators="false" :width="200"
					class="container2_van_swipe" ref="myswipe" v-touch:right="backbefore">
					<van-swipe-item class="container2_item" v-for="(item, index) in lottery" :key="item.id">
						<!-- <div class="container2_item"> -->
						<img :src=picArray[index] width="90" height="90" class="container2_van_swipe_item_img">
						<p class="container2_item_text1">Congratulations</p>
						<p class="container2_item_text2" v-if="item.q_user != undefined">
							Winner:{{ parseUserStr(item.q_user).length > 16 ? parseUserStr(item.q_user).substr(0,16)+"...":parseUserStr(item.q_user)}}
						</p>
						<!-- <p class="container2_item_text3 ">
							Product:{{ item.title.length > 12 ? item.title.substr(0,12)+"...":item.title}}</p> -->
						<p class="container2_item_text4">Ticket Code:<span class="text41">{{ item.q_user_code}}</span>
						</p>
						<!-- <p class="container2_item_text5"></p> -->

						<!-- </div> -->
					</van-swipe-item>
				</van-swipe>
			</div>
			<!-- 		<van-share-sheet v-model:show="showShare" title="立即分享给好友" :options="options" @select="onSelect"
			position="bottom" /> -->
		<!-- </van-pull-refresh> -->
		<div class="container3">
			<van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了" @load="onLoad"
				ref="myvantlist">
				<van-cell v-for="(item, index) in hot_goods" :key="item.id" style="background-color:#F8F8F8;">
					<div :class="index !=  hot_goods.length -1 ? 'one_goods_item' : 'one_goods_item1'">
						<img src="../../assets/share.png" alt="share" class="container_share_img"
							@click="myShare(item.title,item.description)">
						<goods_item>
							<template v-slot:goods_img>
								<img :src=uploads_url+item.thumb alt="goods1" class="goods_item_img"
									@click="ToGoods(item)">
							</template>

							<template v-slot:item_price_text>
								<!-- <img src="../../assets/goods1.png"  alt="goods1" class="goods_item_img"> -->
								<div class="item_price_text" @click="ToGoods(item)">AED:{{item.yunjiage}}</div>
							</template>

							<template v-slot:item_progress>
								<van-progress color="#FFC43A" stroke-width="20px"
									:percentage="(parseFloat(item.canyurenshu)/parseFloat(item.zongrenshu)*100).toFixed(1)"
									:showPivot="false" class="item_progress" @click="ToGoods(item)" />
								<p class="progress_text"
									>
									<!-- v-if="(parseFloat(item.canyurenshu)/parseFloat(item.zongrenshu)*100).toFixed(1) != 0" -->
									{{item.canyurenshu}}/{{item.zongrenshu}}
									<!-- {{(parseFloat(item.canyurenshu)/parseFloat(item.zongrenshu)*100).toFixed(1)}}/100 -->
								</p>
							</template>

							<template v-slot:item_info>
								<div class="item_info_text">
									<span style="font-family: 'PingFang SC';display: inline-block;   white-space: pre-wrap;
  max-width: 300px;" class="item_info_text1">Buy a ticket of {{item.yunjiage}} AED &
										get a chance to win this product. </span>
									<div class="item_info_desc_text"><!-- {{item.canyurenshu}}/{{item.zongrenshu}} -->
										<p class="item_info_desc_text_1">
											<!-- Draw Date:
											{{convertTime(item.time)}} -->
											Sold out,lottery draw begins
										</p>
									</div>

									<div class="container_buttons">
										<van-button round type="success" color="#000000" plain
											style="height: 2rem; width: 5.5rem; border-radius: 60px; font-size: 0.8rem; font-family: 'PingFang SC';"
											@click="AddToCart(item)">Add to cart</van-button>
										<van-button round type="success" color="#3668E3"
											style="left: 0.5rem; height: 2rem; width: 5.5rem; border-radius: 60px; font-size: 0.8rem;font-family: 'PingFang SC';"
											@click="BuyGoods(item)">Buy</van-button>
									</div>
								</div>
							</template>
						</goods_item>
					</div>
				</van-cell>

			</van-list>
		</div>
		<!-- 底部导航 -->
		<footer_nav />
	</div>

</template>

<script>
	import {
		Button,
		ShareSheet,
		showToast,
	} from 'vant';
	import {
		List,
		Row,
		Col
	} from 'vant';
	import {
		reactive,
		ref
	} from 'vue'

	import goods_item from "@/components/goods_item"
	import {
		botimInit,
		setCookie,
		convertUnixToDate,
		login,
		authClickHandler,
		getUserInfo,
		botimShare
	} from "../../util.js"
	import globalData from '@/main.js';
	export default {
		components: {
			[List.name]: List,
			[Row.name]: Row,
			[Col.name]: Col,
		},
		setup() {
			const refreshing = ref(false);
			const show = ref(false);
			const showPopup = () => {
				show.value = true;
			};

			const onLoad1 = () => {
				// 异步更新数据
				// setTimeout 仅做示例，真实场景中一般为 ajax 请求
				// setTimeout(() => {
				// 		for (let i = 0; i < 10; i++) {
				// 			list.value.push(list.value.length + 1);
				// 		}

				// 		// 加载状态结束
				// 		loading.value = false;

				// 		// 数据全部加载完成
				// 		if (list.value.length >= 40) {
				// 			finished.value = true;
				// 		}
				// 	},
				// 	1000);
			};
			const showShare = ref(false);
			// const onSelect = (option) => {
			// 	showToast(option.name);
			// 	showShare.value = false;
			// };

			// const loading = ref(false);

			const active = ref(0);

			//const refreshCount = ref(0);
			// const onRefresh = () => {
			// 	setTimeout(() => {
			// 		showToast('refresh success');
			// 		console.log('refresh success');
			// 		loading.value = false;
			// 		refreshCount.value++;
			// 		// 清空列表数据

			// 		// 重新加载数据
			// 		// 将 loading 设置为 true，表示处于加载状态
			// 		onLoad();
			// 	}, 1000);
			// };

			const list = ref([]);
			const loading = ref(true);
			const finished = ref(false);
			const count = ref(10); // 假设一次加载10个数据

			// 模拟数据加载函数
			const fetchData = () => {
				for (let i = 0; i < count.value; i++) {
					list.value.push(`Item ${list.value.length + 1}`);
				}
			};

			// 滚动加载数据
			const onLoad = () => {
				setTimeout(() => {
					loading.value = false;
					fetchData();
					if (refreshing.value) {
						list.value = [];
						refreshing.value = false;
					}
					// 模拟数据全部加载完毕
					if (list.value.length >= 1) {
						finished.value = true;
					} else {
						loading.value = true;
					}
				}, 1000);
			};

			return {
				// onRefresh,
				// refreshCount,
				// onSelect,
				showShare,
				list,
				onLoad,
				loading,
				finished,
				show,
				showPopup,
			};
		},
		data() {
			return {
				// active_index: 0,
				lottery: [],
				hot_goods: [],
				all_goods: [],
				uploads_url: null,
				slides: [],
				picArray: {},
				realValue: {},
				// duration:null,
			}
		},
		computed: {
			shortenedText() {
				if (this.text && this.text.length > 5) {
					return `${this.text.substring(0, 6)}...`; // 返回前6个字符加上省略号
				} else {
					return this.text; // 若文本不超过6个字符则直接返回全部文本
				}
			},
			threeDecimal() {
				return function(value) {
					return value.toFixed(3);
				}
			},
		},
		onLoad() {
			//console.log("---onLoad---")
		},
		created() {
			//console.log("---created111---")
			var userInfo = this.$cookies.get('user');
			if (userInfo == undefined || userInfo == null) {
				login()
				//showToast("userInfo 111:")
				// authClickHandler();
				//console.log("---created222---")
			} else {
				//showToast("userInfo 222:"+userInfo.ucenterid)
				// botimInit()
				//console.log("---created userInfo---", userInfo)
			}
			window.scroll(0, 0);

			this.uploads_url = globalData['uploads_url'];
			this.getAllGoods()
		},
		beforeMount() {
			//console.log("---beforeMount---")
		},
		mounted() {
			//console.log("---mounted---")
			//const startTime = new Date().getTime(); // 函数执行前记录时间戳
			this.mapUser()
			
			//this.getWin()
			
			//const endTime = new Date().getTime(); // 函数执行前记录时间戳
			//this.duration = endTime - startTime; // 计算并存储执行时长
			//console.log("this.duration",this.duration)

			// this.uploads_url = globalData['uploads_url'];
			// console.log(globalData)
			// console.log(globalData['base_url'])
			//this.$refs.swipe.resize();
			// console.log("---------------------------")
			// console.log(this.$refs)
			// // console.log(this.$refs.swipe)
			// console.log(this.$refs.swipe)
			// console.log(this.$refs.myswipe)
			// console.log("---------------------------")

			// this.$refs.swipe.swipeTo(0);
			// this.$refs.swipe.prev();
			// this.$refs.swipe.next();
			// this.$refs.swipe.next();
			// for (var i = 1; i <= 5; i++) {
			// 	setTimeout(() => {
			// 		this.$nextTick(() => {
			// 			if (this.$refs.myclick1 != undefined) {
			// 				this.$refs.myclick1.click();
			// 			}
			// 		});
			// 	}, 5000);
			// }
			setTimeout(()=> {
				this.scrollToBottom()
				this.getAllDraws();
			},1000)
			
			
			// this.scrollToBottom();
			// this.$refs.mypullrefresh.click();
			// this.$ref.myvantlist.
			// setTimeout(() => {
			// 	window.location.reload();
			// }, 3000);
			// window.location.reload();
			//this.$refs.swipe2.resize();
		},
		beforeUpdate() {
			// 不能用,因为会死循环
			//console.log("---beforeUpdate---")
		},
		update() {
			// updated() {
			// 不能用,因为会死循环
			//console.log("---update---")
		},
		beforeUnmount() {
			//console.log("---beforeUnmount---")
		},
		beforeMount() {
			//console.log("---beforeMount---")
		},
		methods: {
			getAllDraws() {
				var that = this;
				var uid = this.$cookies.get('uid')
				if(uid == undefined || String(uid) == "" ||  String(uid).length == 0)
				{
					uid = String(window.Bridge.getStorageSync('uid'))
				}
				//console.log('===getAllDraws uid===', uid)
				if(String(uid) == undefined || String(uid) == "" || String(uid).length == 0)
				{
					showToast("|"+uid+"|")
				}
				
				
				const formData = new FormData()
				if (uid != null) {
					formData.append("uid", uid)
				}
				this.axios({
					method: "POST", // method:"post" data:{"firstName":"Tom","lastName":"Sun"} //get params:{id:123}
					url: globalData['mobile_url'] + "cart/cartlist/",
					data: formData,
				}).then(function(response) {
					console.log("mounted cartlist response:", response)
					// if (Object.keys(response.data[0]).length > 0) {
					// 	that.show = true
					// }
					that.realValue.length = 0
					for (let key in response.data[2]) {
						var curNum = response.data[2][key].num
						that.realValue[key] = curNum;
					}
				}).catch(function(error) { // 请求失败处理
					console.log("---error start---");
					console.log(error);
					console.log("---error end---");
				});
			},
			myclick() {
				// console.log("8888888888888888888888888888888")
			},
			scrollToBottom() {
				// 使用window.scrollTo执行下拉操作
				// console.log("xxxxxxxxxxxxxxxxxxxxxxx");
				// console.log(document.documentElement.scrollHeight + 500);
				// window.scrollTo({
				// 	top: document.documentElement.scrollHeight + 400,
				// 	behavior: 'smooth' // 平滑滚动
				// });
				window.scrollTo({
				 	top:10,
				 	behavior: 'smooth' // 平滑滚动
				 });
				// console.log("yyyyyyyyyyyyyyyyyyyyyyyyy");
			},
			mylogin() {
				const user = $cookies.get('user');
				//console.log("===user:===", user)
				const contaner = document.querySelector('.user_money_info3');
				//console.log("===login user===")
				//console.log(user)
				//console.log(contaner)
				//console.log("================")
				contaner.innerHTML = '';
				for (const [key, value] of Object.entries(user)) {
					const div = document.createElement('div');
					div.classList.add('use-item')
					div.innerHTML = `
				      <span>${key}:</span>
				      <span>${JSON.stringify(value)}</span>
				    `;
					contaner.appendChild(div);
				}
			},
			getAllGoods: function() {
				var that = this
				//console.log("---getAllGoods start mobile_url:" + globalData['mobile_url'] + 'mobile/')
				this.axios({
					method: "GET", // method:"post" data:{"firstName":"Tom","lastName":"Sun"} //get params:{id:123}
					url: globalData['mobile_url'] + 'mobile/',
				}, {
					headers: {
						'Access-Control-Allow-Origin': '*'
					}
				}).then(function(response) {
					//console.log("response:", response)
					//console.log("response data:", response.data) //JSON.stringify(data)
					if (response.data.length >= 4) {
						that.lottery = response.data[0];
						for (let k in response.data[0]) {
							var images = response.data[0][k].picarr;
							that.parsePicArr(k, images);
						}
						that.hot_goods = response.data[1];
						that.all_goods = response.data[2];
						//that.slides = response.data[3];
						that.slides = response.data[4];
					}

				}).catch(function(error) { // 请求失败处理
					console.log(error);
					//console.log("---error end---");
				});
			},
			getWin() {
				var that = this
				//console.log("---toWinner start :" + globalData['mobile_url'] + 'home/userbuylist')
				var uid = that.$cookies.get('uid')
				if (uid ==  undefined || uid == null || String(uid).length == 0) {
					//showToast("...uid is null...")
					//console.log("===getWin uid is null will return===")
					uid = String(window.Bridge.getStorageSync('uid'))
					if (uid ==  undefined || uid == null || String(uid).length == 0) {
						return;
					}
				}
				this.axios({
					method: "GET", // method:"post" data:{"firstName":"Tom","lastName":"Sun"} //get params:{id:123}
					url: globalData['mobile_url'] + 'shopajax/getUserOrderList/0/10/1/2/' + uid

				}).then(function(response) {
					
					//console.log("---that.winItems---", response.data)
					var winItems = []
					winItems = response.data['listItems']
					//console.log("---that.winItems---", winItems)
					//console.log("---that.winItems---", typeof winItems)
					if (winItems != null && winItems.length > 0) {
						that.$cookies.set('dotShow', true)
					}
					//console.log("===getCookie('dotShow')===:", that.$cookies.get('dotShow'))
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});
			},
			mapUser: function() {
				var userInfo = this.$cookies.get('user')
				// showToast("userInfo:" + userInfo)
				//showToast("ucenterid:" + userInfo.ucenterid)
				//console.log("===mapUser userInfo===", userInfo)
				if(userInfo == undefined || userInfo.ucenterid == "") {
					login();
				}
				const formData = new FormData()
				if (userInfo != null) {
					if (userInfo.avatar != null) {
						formData.append("avatar", userInfo.avatar)
					}
					if (userInfo.firstName != null) {
						formData.append("firstName", userInfo.firstName)
					}
					if (userInfo.lastName != null) {
						formData.append("lastName", userInfo.lastName)
					}
					if (userInfo.ucenterid != null) {
						formData.append("ucenterid", userInfo.ucenterid)
					}
					if (userInfo.phone != null) {
						formData.append("phone", userInfo.phone['phone'])
					}
					if (userInfo.email != null) {
						formData.append("email", userInfo.email)
					}
				} else {
					//showToast("userInfo is null:" + userInfo)
					authClickHandler();
					userInfo = this.$cookies.get('user');
					// if (userInfo.firstName != null) {
					// 	formData.append("firstName", userInfo.firstName)
					// }
					// if (userInfo.lastName != null) {
					// 	formData.append("lastName", userInfo.lastName)
					// }
				}
				var that = this
				//console.log("---mapUser start :" + globalData['mobile_url'] + 'mobile/mapUser/')
				this.axios({
					method: "POST",
					url: globalData['mobile_url'] + 'mobile/mapUser/',
					data: formData,
				}, {
					headers: {
						'Access-Control-Allow-Origin': '*'
					}
				}).then(function(response) {
					showToast("response.data:" + response.data)
					//console.log("mapUser response:", response)
					//console.log("mapUser response data:", response.data)
					that.$cookies.set('uid', String(response.data), {
						expires: '10m'
					})
					window.Bridge.setStorageSync('uid',String(response.data))
					// console.log("---mapUser response.data.length---:" + response.data.length)
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});
			},
			onChange: function(index) {
				// showToast(` ${index}`);
				let length = this.hot_goods.length;
				//console.log("========onChange:========", index)
				const lastIndex = length - 1;
				if (index >= lastIndex - 3) {
					// 当滑动到倒数第四个元素时，停止自动播放
					//this.autoplayDuration = 0;
					//stop-propagation = true;
					//this.$refs.swipe.stopAutoplay();
				} else {
					// 在其他情况下，恢复自动播放
					//this.autoplayDuration = 3000;
					//this.stop-propagation = false;
					//this.$refs.swipe.startAutoplay();
				}
			},
			onClick: function(index) {
				//console.log("===onClick index===:", index)
			},
			AddToCart: function(item) {
				//console.log("---AddToCart ---item:", item)
				if (Number(item.canyurenshu) >= Number(item.zongrenshu)) {
					showToast("has not enough item!1" + item.canyurenshu)
					return;
				}
				//console.log("---AddToCart url ---", globalData['goods_url'] + item.id)
				var shopInfo = {
					'shopid': item.id,
					'money': item.money,
					'shenyu': item.shenyurenshu,
				};
				//console.log("---AddToCart ---shopInfo:", shopInfo)

				var cartlist = this.$cookies.get('Cartlist');
				var buyCount = 1;
				setCookie(shopInfo, buyCount, false)

				//var keys = this.$cookies.keys();
				//console.log("keys 33 is", keys)

				var cartlist = this.$cookies.get('Cartlist');
				//console.log("new cartlist  is", cartlist)
				var uid = this.$cookies.get('uid')
				if (uid ==  undefined || uid == null || String(uid).length == 0) 
				{
					uid = String(window.Bridge.getStorageSync('uid'))
				}
				//console.log('===AddToCart item.id===', item.id)			
				if (Number(this.realValue[item.id]) >= item.shenyurenshu) {
					//console.log("has not enough item!!!")
					showToast("has not enough item2!")
					this.realValue[item.id] = item.shenyurenshu
					return;
				}
				
				this.axios({
					method: "GET",
					url: globalData['add_cart_url'] + item.id + "/" + "1/0/" + uid
				}, {
					headers: {
						'Access-Control-Allow-Origin': '*'
					}
				}).then(function(response) {
					//console.log("AddToCart response data:", response.data) //JSON.stringify(data)
					// for (var i = 0; i < response.data.length; i++) {
					// 	console.log("AddToCart one item data:", response.data[i])
					// }
					if (response.data.code != null) {
						if (response.data.code != 0) {
							if (response.data.code == 5) {
								showToast("Cart Full!" + item.shenyurenshu)
							} else {
								showToast("Add to Cart Error!")
							}

						} else {
							showToast("Add to cart successfully!")
						}
					} else {
						showToast("Add to cart successfully!")
					}
				}).catch(function(error) { // 请求失败处理
					console.log(error);
				});

				// this.axios({
				// 	method: "GET", 
				// 	url: this.cartlist_url
				// }).then(function(response) {
				// 	console.log("AddToCart response:", response)
				// 	console.log("AddToCart response data:", response.data) //JSON.stringify(data)
				// 	for (var i = 0; i < response.data.length; i++) {
				// 		console.log("AddToCart one item data:", response.data[i])
				// 	}
				// }).catch(function(error) { // 请求失败处理
				// 	console.log(error);
				// });
			},
			BuyGoods: function(item) {
				// console.log("---BuyGoods  item:---", item)
				// console.log(typeof item)
				var contents = JSON.stringify(item);
				// console.log(typeof contents)
				// console.log(contents)
				this.$router.push({
					name: 'order',
					params: {
						context: contents,
					}
				})
			},
			ToGoods: function(item) {
				//console.log("---ToGoods  item:---", item)
				//console.log(typeof item)
				var contents = JSON.stringify(item);
				//console.log(typeof contents)
				//console.log(contents)
				this.$router.push({
					name: 'goods',
					params: {
						context: contents,
					}
				})
			},
			parseUserStr: function(userInfo) {
				//console.log("==parseUserStr userInfo===:", userInfo);
				if (userInfo == null) {
					return;
				}
				var infos = userInfo.split(";");
				for (let i = 0; i < infos.length; i++) {
					var values = infos[i].split(":");
					//console.log("values:", values);
					// for(_value in values) {
					// 	if(_value == "8") {

					// 	}
					// }
					if (values.length == 3) {
						if (values[2].includes("username")) {
							var newValues = infos[i + 1].split(":");
							//console.log("newValues:", newValues);
							if (newValues.length == 3) {
								var newName = newValues[2].replace("\"", '');
								return newName.replace("\"", '');
							}
						}
					}
				}
				return "";
			},
			convertTime: function(timeStamp) {
				return convertUnixToDate(timeStamp)
			},
			myShare(title, desc) {
				//console.log("===myShare===")
				botimShare(title, desc);
				//console.log("===myShare end===")
			},
			parsePicArr: function(index, picArr) {
				//console.log("===index===",picArr)
				//console.log("===picArr===",picArr)
				var infos = picArr.split(":");
				//console.log("===infos===",infos)
				for (var _info in infos) {
					//console.log("===_info===",infos[_info])
					//console.log("===_info===",typeof infos[_info])
					if (!infos[_info].includes("shopimg")) {
						continue
					}
					var newInfos = infos[_info].split(";");
					//console.log("===newInfos===",newInfos)
					for (var _info1 in newInfos) {
						//console.log("===newInfos[_info1]===",newInfos[_info1])
						if (!newInfos[_info1].includes("shopimg")) {
							continue
						}

						var imagestr = newInfos[_info1].split(";");
						//console.log("===images===",imagestr)
						var tmpIndex = 0;
						for (var _image in imagestr) {
							//console.log("imagestr[_image]", imagestr[_image])

							if (tmpIndex++ != imagestr.length - 1) {
								continue;
							}
							//console.log("imagestr[_image]22",imagestr[_image])
							var reg1 = new RegExp('"', "g")
							//console.log("imagestr[_image]",imagestr[_image].replace(reg1," "))
							if (imagestr[_image].includes("shopimg")) {
								//this.imageArray.push("require(\""+this.uploads_url+imagestr[_image].replace(reg1,"")+"\")")
								this.picArray[index] = this.uploads_url + imagestr[_image].replace(reg1, "")
							}
							//console.log("===this.picArray===:",this.picArray)
						}
					}
				}
				//console.log("===this.imageArray===",this.imageArray)
			},
		},
	}
</script>

<style>
	.container1 {
		background: linear-gradient(rgba(208, 207, 254, 1), rgba(205, 218, 252, 0));
		width: 100vw;
		/* height: 50vh; */
	}

	.container1_top_icon {
		margin-top: 3rem;
		margin-left: 1rem;
		width: 3rem;
		height: 3rem;
	}

	.container1_top_text {
		position: relative;
		margin-top: -2.5rem;
		margin-left: 5rem;
		font-family: 'PingFang SC';
		font-weight: Bold;
		font-size: 1.5rem;
		word-spacing: 0.2rem;
		z-index: 2;
	}

	.container1_bg {
		/* 保持图片纵横比，完整显示在容器内 */
		/* 	position: relative;
		background: linear-gradient(rgba(173, 206, 247, 1), rgba(216, 230, 254, 1));
		border-radius: 25px;
		top: 1rem;
		margin: 0.1rem 0.5rem 0.5rem 0.5rem;
		height: 35vh; */
	}

	.container1_swipe_wrapper {
		margin-left: 0.5rem;
		/*margin-right:0.5rem; */
		/* position: relative; */
		/* width: calc(100vw); */
		/* height: 45vh; */
		margin-top: 3rem;
	}

	.container1_swipe_wrapper_img {
		/* position: relative; */

		/* max-width: 95%; */
		/* 图片最大宽度为父容器宽度 */
		/* max-height: 95%; */
		/* 图片最大高度为父容器高度 */
		/*  width: auto; */
		/* 宽度自适应 */
		/* height: auto; */
		/* 高度自适应 */
		/* height: 33.5vh; */
		/* top: 2rem; */
		/* left: 1.5rem; */
		/* zoom:0.33; */
		width: 720px;
	}

	.container2 {
		position: relative;
		height: 32vh;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20px;
		box-sizing: border-box;
		flex-direction: column;
	}

	.container2_bg {
		position: relative;
		margin-top: 0.5rem;
		/* height: 32vh; */
		width: 100%;
		height: 100%
	}

	.container2_rule {
		/* position: absolute; */
		left: 1rem;
		top: 1.2rem;
		z-index: 1;
		width: 20%;
		height: 10%;
	}

	.container2_win {
		/* position: absolute;
		left: 18.5rem;
		top: 1.2rem;
		width: 20%;
		height: 10%; */
	}

	.container2_van_swipe {
		/* position: absolute; */
		margin-top: -280px;
		margin-left: 0rem;
		width: 100vw;
		/* display: flex;
		justify-content: space-between;
		align-items: center; */
		padding: 20px;
		box-sizing: border-box;
		/* color: green; */
		/* background-color:red; */
	}

	.container2_item {
		/* position: absolute; */
		width: 100px;
		height: 350px;
		display: flex;
		/* justify-content: space-between; */
		/* align-items: center; */
		/* padding: 20px; */
		box-sizing: border-box;
		/* line-height: 20px; */
		margin-top: -60px;
		flex-direction: column;
	}

	.container2_van_swipe_item_img {
		/* position: absolute; */
		/* width: 6.5rem;
		height: 7.5rem; */
		margin-left: 70px;
		margin-top: 40px;
		/* align-items: center; */
		border-radius: 10px;
		display: flex;
		/* flex-direction: column; */

		font-family: 'PingFang SC';
		font-size: 0.9rem;
		box-sizing: border-box;
	}

	.container2_item_text1 {
		margin: 0;
		padding: 0;
		/* position: absolute; */
		color: rgb(254, 0, 0);
		font-family: 'PingFang SC';
		/*font-weight: bold*/
		;
		font-size: 1.1rem;
		/* top: -15px; */
		padding-left: 40px;
		/* width:150px; */
		/* align-items: center; */
		/* padding-top: 20px; */
	}

	.container2_item_text2 {
		/* position: absolute; */
		padding: 0;
		margin: 0;
		font-size: 1rem;
		padding-left: 40px;
		/* padding-top: 20px; */
		font-family: 'PingFang SC';

		/* display: inline-block;
		white-space: pre-wrap; */
	}

	.container2_item_text3 {
		/* position: absolute; */
		margin: 0;
		padding: 0;
		font-size: 1rem;
		padding-left: 40px;

		/* display: inline-block;
		white-space: pre-wrap; */
	}

	.container2_item_text4 {
		/* position: absolute; */
		margin: 0;
		padding: 0;
		font-size: 0.8rem;
		padding-left: 40px;
		font-family: 'PingFang SC';
	}

	.text41 {
		/* position: absolute; */
		margin: 0;
		padding: 0;
		font-size: 0.8rem;
		/* padding-left: 40px; */
		font-weight: bold;
		font-family: 'PingFang SC';
	}


	.container3 {
		/* 	width: 100vw;
		height: 300vh; */
		/* height: 200vh; */
	}

	.one_goods_item {
		position: relative;
		border: 0.1;
		border-radius: 25px;
		width: 95vw;
		left: 0.1rem;
		right: 0.1rem;
		top: 0.5rem;
		height: 25rem;
		margin-bottom: 1rem;
		background-color: white;
	}

	.one_goods_item1 {
		position: relative;
		border: 0.1;
		border-radius: 25px;
		width: 95vw;
		left: 0.1rem;
		right: 0.1rem;
		top: 0.5rem;
		height: 25rem;
		margin-bottom: 5rem;
		background-color: white;
	}

	.container_share_img {
		position: relative;
		top: 1.5rem;
		right: 0;
		width: 3rem;
		height: 3rem;
		z-index: 1;
		margin-right: 1rem;
	}

	.goods_item_img {
		position: relative;
		margin-top: 1.5rem;
		width: 92vw;
		margin-right: 0.5rem;
	}

	.item_price_text {
		position: relative;
		margin-top: 1rem;
		text-align: left;
		margin-left: 0.5rem;
		color: rgb(254, 89, 40);
		font-family: 'PingFang SC';
		font-size: 1.5rem;
		font-weight: bold;
	}

	.item_progress {
		position: absolute;
		margin-top: -1rem;
		width: 250px;
		margin-left: 300px;
		border-radius: 35px;
		--van-progress-pivot-line-height: 1.3rem;
		/*啥单位???*/
		--van-progress-pivot-font-size: 1rem;
		--van-progress-pivot-text-color: white;
		--van-progress-pivot-background: blue;
	}

	.progress_text {
		margin: 0;
		padding: 0;
		position: absolute;
		font-size: 30px;
		/* margin-top: -1rem; */
		margin-top: -22px;
		width: 150px;
		left: 540px;
	}

	.item_info_text {
		margin: 0;
		padding: 0;
		position: relative;
		text-align: left;
		margin-left: 0.5rem;
		/* 		margin-top: 1.2rem; */
		font-size: 0.8rem;
		line-height: 1.1rem;
		top: 50px;
	}

	.item_info_text2 {
		font-size: 0.8rem;
	}

	.item_info_text1 {
		margin: 0;
		padding: 0;
		font-size: 1.0rem;
		display: inline-block;
		white-space: pre-wrap;
		/* height: 30; */
		/* max-width: 700px; */
	}

	.item_info_desc_text {
		position: absolute;
		margin: 0;
		padding: 0;
		border: 0.1rem;
		border-style: dashed;
		width: 10rem;
		/* left: 1rem; */
		/* padding-left: 0.1rem; */
		border-radius: 0.5rem;
		/* line-height: 0.5rem; */
		font-family: 'PingFang SC';
		/* padding-top: 0.1rem; */
		top: 90px;
	}

	.item_info_desc_text_1 {
		margin-top: 5px;
		padding-left: 0.5rem;
		/* text-align: left; */
		font-family: 'PingFang SC';
		line-height: 0.9rem;
		white-space: wrap;
		margin-bottom: 5px;

	}


	.container_buttons {
		position: absolute;
		margin: 0;
		padding: 0;
		/* position: relative; */
		margin-left: 45vw;
		/* margin-top: -2.2rem; */
		display: flex;
		justify-content: center;
		/* 水平居中 */
		align-items: center;
		/* 垂直居中 */
		/* height: 200px; */
		/* 容器高度 */
		top: 95px;
	}

	.van-toast__text {
		font-size: 1.5rem;
	}

	.van-toast {
		width: 80vw;
		height: 10vh;
	}
</style>